<template>
    <el-row>
        <!-- 头部 -->
        <el-col :span="24">
            <el-card shadow="hover">
                <el-breadcrumb :separator-icon="ArrowRightBold">
                    <el-breadcrumb-item :to="{ path: '/admin_index' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item>订单管理</el-breadcrumb-item>
                    <el-breadcrumb-item>佣金订单</el-breadcrumb-item>
                </el-breadcrumb>
            </el-card>
        </el-col>
        <div style="padding: 5px;"></div>
        <!-- 内容区域 -->
        <el-col :span="24">
            <el-card shadow="hover">
                <template #header>
                    <div style="display: flex; align-items: center;justify-content: space-between;">
                      <div style="display: flex; align-items: center;">
                        <el-input style="width: 260px;" v-model="inputval" placeholder="请输入UID、手机、昵称、备注" />
                        <div style="padding: 5px;"></div>
                      <el-date-picker v-model="page.time_date[0]" :default-value="page.time_date[0]" type="datetime" placeholder="开始日期" style="width: 180px;" />
                      <div style="width: 15px"></div>
                      <el-date-picker v-model="page.time_date[1]" :default-value="page.time_date[1]" default-time="12:00:00" type="datetime" placeholder="结束日期" style="width: 180px;" />
                      <div style="padding: 5px;"></div>
                        <el-button type="primary" :icon="Search" @click="inputSearch()">搜索</el-button>
                      </div>
                      <div style="float:right;">
                        自动审批
                        <el-tooltip :content="yjspOpen == 1 ? '开启' : '关闭'" placement="top">
                          <el-switch v-model="yjspOpen" :active-value="1" :inactive-value="0"  @change="openLook"></el-switch>
                        </el-tooltip>
                      </div>
                    </div>
                </template>

                <!-- 表格 -->
                <el-table :data="tableData.list" :border="true" style="width: 100%">
                    <el-table-column prop="id" label="序号" width="80" />
                    <!-- <el-table-column prop="orderid" label="订单ID" width="230" /> -->
					
                    <el-table-column label="用户详情" width="200">
                        <template #default="scope">
                            <div>UID：{{scope.row.uid}}</div>
                            <div>昵称：{{scope.row.user?.nickname}}</div>
                          <div>手机号：{{scope.row.user?.phone}}</div>
                          <div>备注：{{scope.row.user?.remark}}</div>
                    		<div>类型：
                    			<el-tag type="success" v-if="scope.row.user.role == 0">正常玩家</el-tag>
                    			<el-tag type="danger" v-if="scope.row.user.role == 1">内部用户</el-tag>
                    		</div>
                        </template>
                    </el-table-column>>

                    <el-table-column label="转入金额">
                        <template #default="scope">
                            <el-tag type="danger">￥{{ scope.row.money }}</el-tag>
                        </template>
                    </el-table-column>
                  <el-table-column label="余额前后">
                    <template #default="scope">
                      <div>操作前:<el-tag type="danger"> ￥{{scope.row.money_log ? scope.row.money_log.money:scope.row.user.money}}</el-tag></div>
                      <div>操作后:<el-tag type="success" v-if="scope.row.money_log">￥{{ scope.row.money_log.moneys}}</el-tag></div>
                    </template>
                  </el-table-column>
                    <el-table-column label="订单状态">
                        <template #default="scope">
                            <el-tag type="danger" v-if="scope.row.status == '待审核'">等待处理</el-tag>
                            <el-tag type="success" v-if="scope.row.status == '通过'">通过</el-tag>
                            <el-tag type="warning" v-if="scope.row.status == '拒绝'">失败</el-tag>
                        </template>
                    </el-table-column>

                    <el-table-column prop="create_time" label="订单时间" />

                    <el-table-column label="订单操作">

                        <template #default="scope">
                            <el-popconfirm title="确定通过吗？" @confirm="admin_walletsave_status(scope.row.id, '通过')" v-if="role.includes('tongyi')">
                                <template #reference>
                                    <el-button :disabled="scope.row.status != '待审核'" type="success">通过</el-button>
                                </template>
                            </el-popconfirm>
                            <el-popconfirm title="确定拒绝吗？" @confirm="admin_walletsave_status(scope.row.id, '拒绝')" v-if="role.includes('jujue')">
                                <template #reference>
                                    <el-button :disabled="scope.row.status != '待审核'" type="danger">拒绝</el-button>
                                </template>
                            </el-popconfirm>
                        </template>



                    </el-table-column>

                </el-table>
                <!-- 分页 -->

                <div style="padding: 10px;"></div>
                <el-pagination small background v-model:currentPage="page.pagenum" v-model:page-size="page.pagesize"
                    :page-sizes="[20, 50]" :small="small" :background="background" layout="total, prev, pager, next, jumper"
                    :total="page.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />

            </el-card>
        </el-col>
    </el-row>

</template>



<script setup>

import { ref, reactive, onMounted } from 'vue'
import { request_post } from '@/common/axios/request.js'
import { success, error } from '@/common/tool/message.js'
import { ArrowRightBold, UserFilled, Search } from '@element-plus/icons-vue'


const tableData = reactive({ list: [] })

const yjspOpen = ref(0);
function openLook(e){
  request_post('/admin_config_create', {'yjsp_open':e}).then(res => {
    if (res.data.code == 200) {
      return success(res.data.msg)

    } else {
      return error(res.data.msg)
    }
  })
}
const role = ref([]);
onMounted(() => {
    admin_yjzrye_order()
  const list = JSON.parse(window.localStorage.getItem('menus_data'))
  let menu = [];
  for(let key in list){
    if(list[key].name=='订单管理'){
      menu = list[key]
    }
  }
  console.log(menu,'menu');
  let child = [];
  for(let i in menu.children){
    if(menu.children[i].name=='佣金订单'){
      child = menu.children[i]
    }
  }
  let roleArr =[];

  for(let i in child.children){
    roleArr.push(child.children[i].role)
  }
  role.value = roleArr
})


// 搜索 
const inputval = ref('')
const wallDialog = ref(false)
function inputSearch() {
    // if (inputval.value == '') {
    //     return error('请输入代理UID')
    // }
    page.uid = inputval.value
    admin_yjzrye_order()
}


// 获取用户列表
function admin_yjzrye_order() {

    request_post('/admin_yjzrye_order', page).then((res) => {

        if (res.data.code == 200) {
            yjspOpen.value = res.data.data.yjsp_open
            tableData.list = res.data.data.data
            page.total = res.data.data.total
        } else {
            return error(res.data.msg)
        }
    })

}

let submitLock = false
function admin_walletsave_status(id, status) {
	if(submitLock) return
	submitLock = true
    request_post('/admin_yjzrye_status', { id, status }).then((res) => {
		setTimeout(()=>{
			submitLock = false
		}, 500)
        if (res.data.code == 200) {
            admin_yjzrye_order()
            return success(res.data.msg)
        } else {
          admin_yjzrye_order()
            return error(res.data.msg)
        }
    })
}
var now_date = new Date();
var now_date2 = new Date();
var year = now_date.getFullYear();
var month = now_date.getMonth() + 1; // 月份从0开始，所以要加1
var day = now_date.getDate();
now_date.setHours(23, 59, 59);
now_date2.setHours(0,0,0)
const page = reactive({
  uid: '',
  time_date:[
    now_date2,now_date
  ],
  pagenum: 1,
  pagesize: 18,
  total: 0
})

function handleSizeChange(val) {
    page.pagenum = val
    admin_yjzrye_order()
}
function handleCurrentChange(val) {
    page.pagenum = val
    admin_yjzrye_order()
}


</script>

<style></style>
